<!-- 首页点击按钮的页面 -->
<template>
  <view class="contents screen-width">
    <view class="search_title">
      <image
        src="../../static/returnimg.png"
        mode=""
        class="image_back"
        @tap="backPage"
      ></image>
      <view class="search_border">
        <input type="text" placeholder="请输入公司名称" v-model="companyName" />
        <image
          src="../../static/proty/search_icon.png"
          mode=""
          @tap="searchCompany"
        />
      </view>
    </view>
    <text class="result">为您找到{{ total }}家</text>

    <scroll-view
      scroll-y
      class="search_result"
      @scrollTolower="scrollTolower"
      :lower-threshold="1000"
    >
      <view
        class="result_item"
        v-for="item in dataList"
        :key="item.companyId"
        @tap="companyDetails(item.companyId,item.companyName)"
      >
        <view class="company_info">
          <view class="company_info_title" v-html="item.companyName"></view>
          <view class="company_info_person">
            <view class="person_item">
              法定代表人：<text>{{ item.legalPerson }}</text>
            </view>
            <view class="date_item"
              >成立时间：<text>{{ item.establishTime }}</text>
            </view>
          </view>
          <view class="company_info_address">
            <text class="address_item"> 地址：{{ item.companyAddress }} </text>
          </view>
        </view>
        <view class="tomore">
          <image src="../../static/company/goPage.png" mode=""></image>
        </view>
      </view>
    </scroll-view>
    <Festival></Festival>
  </view>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';

export default {
  //import引入的组件需要注入到对象中才能使用
  components: {},
  data() {
    //这里存放数据
    return {
      options: {}, // 地址栏的值
      companyName: "", // 输入框的值
      dataList: [], // 数据列表
      pageIndex: 1, // 当前页
      total: 0, // 总条数
      // throttle: false, // 节流阀
    };
  },
  //监听属性 类似于data概念
  computed: {},
  //监控data中的数据变化
  watch: {},
  onShow() {
    uni.getLocation({
      type: "wgs84",
      success(e) {
        console.log(e);
      },
    });
  },
  //方法集合
  methods: {
    // 返回上一页
    backPage() {
      uni.navigateBack({
        delta: 2,
      });
    },
    // 获取地区列表
    getDataList(val) {
      // this.scroolTolower = true;
      let obj = {
        rea: "",
        city: "",
        companyId: "",
        companyName: val,
        endLat: 0,
        endLng: 0,
        pageIndex: this.pageIndex,
        pageSize: 10,
        province: "",
        startLat: 0,
        startLng: 0,
      };
      this.$post("/bmj-api/api/es/company/query.json", obj).then((res) => {
        // console.log(res);
        if (res.retCode === 0) {
          let { totalElements, content } = res.data;
          this.$changeText(res.data.content, "companyName", val);
          this.dataList.push(...content);
          this.total = totalElements;
        }
      });
    },

    // 点击跳到企业详情
    companyDetails(id,companyName) {
      if (companyName){
        let temp = companyName.replace(/<\/?.+?>/g, "");
        companyName = temp.replace(/ /g, "");
      }
      uni.navigateTo({
        // url: `/pages/enterpriseDetails/brand_detail?id=${id}&type=1&name=${companyName}`
        url: `/pages/enterpriseDetails/brand_detail?id=${id}&type=1&name=${companyName}&liIndex=0&showNew=true`
      });
    },
    // 点击搜索企业
    searchCompany() {
      this.dataList = [];
      this.getDataList(this.companyName);
    },
    // 上拉加载下一页
    scrollTolower() {
      console.log("scrollTolower", 123);
    },
  },
  onReachBottom() {
    console.log("onReachBottom", 123);
  },

  onLoad(option) {
    this.options = option;
    if (option.type == "company") {
      this.companyName = option.enterprise;
      this.getDataList(option.enterprise);
    }
  },
};
</script>
<style lang="less" scoped>
//@import url(); 引入公共css类

.search_title {
  padding: 20px 30rpx;
  background-color: #2862ad;
  height: 120rpx;

  display: flex;
  align-items: center;
  justify-content: space-around;
  image.image_back {
    width: 18rpx;
    height: 34rpx;
    margin: 0 20rpx;
  }
  .search_border {
    height: 80rpx;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 0 30rpx;
    width: 600rpx;
    border-radius: 10rpx;
    margin-right: 40rpx;
    input {
      flex: 1;
    }
    image {
      width: 32rpx;
      height: 32rpx;
    }
  }
}
.result {
  height: 100rpx;
  display: flex;
  align-items: center;
  color: #ff7648;
  font-size: 28rpx;
  padding: 0 30rpx;
}
.search_result {
  height: calc(100vh - 220rpx);
  padding: 10rpx 30rpx 0rpx;

  .result_item {
    margin-bottom: 20rpx;
    height: 260rpx;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-around;
    border-radius: 10rpx;
    .company_info {
      padding-left: 40rpx;
      padding-right: 40rpx;
      display: flex;
      flex-direction: column;
      justify-content: center;
      .company_info_title {
        margin-bottom: 16rpx;
        color: #333;
        font-size: 32rpx;
        font-weight: 700;
      }
      .company_info_person {
        width: 100%;
        display: flex;
        justify-content: space-between;
        margin: 12rpx 0;

        .person_item {
          color: #333;
          font-size: 26rpx;
        }
        .date_item {
          color: #333;
          font-size: 26rpx;
        }
      }
      .company_info_address {
        font-size: 22rpx;
        color: #aaa;
      }
    }
    .tomore {
      width: 16rpx;
      height: 24rpx;
      margin: 0 30rpx;
      image {
        width: 100%;
        height: 100%;
      }
    }
  }
}
</style>
